<template>
    <div>
        <input v-model="inputValue" type="text" :placeholder="placeholder">
    </div>
</template>
<script>
export default {
    props: {
        placeholder: {
            type: String,
            default: ''
        },
        value: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            inputValue: ''
        }
    },
    // 监听状态发生变化  data props
    watch: {
        // 接收 v-model 参数
        value(newData) {
            this.inputValue = newData
        },
        // 修改 v-model 参数
        inputValue(newData) {
            this.$emit('input', newData)
        }
    }
}
</script>